﻿
<link href="~/lib/layui/css/layui.css" rel="stylesheet" />   @* 一 ①样式 *@ @* ②layui js库 *@
<script src="~/js/js.cookie.js"></script>
<script src="~/js/moment.js"></script>
<script src="~/lib/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>

<div id="demo-laypage-all"></div>

<h2>积分商品分页列表</h2>
@*
{
      "id": 8,
      "code": "7242451192880603139",
      "name": "特斯拉 models",
      "imgUrl": "/imgs/26281bad-c9fa-4a1c-bd84-cb244db4bc347.png",
      "description": "特斯拉 带图片的",
      "price": 2000000,
      "stock": 2,
      "status": 0,
      "createTime": "2024-09-20T11:57:51.9292942",
      "updateTime": "2024-09-21T12:25:44.4475919",
      "isDeleted": false
    }, *@

<table class="layui-table">
    <tr>
        <td>编号</td>
        <td>Code</td>
        <td>商品名称</td>
        <td>图片</td>
        <td>描述</td>
        <td>价格</td>
        <td>库存树立</td>
        <td>状态</td>
        <td>创建时间</td>
        <td>更新时间</td>
        <td>是否删除</td>

    </tr>

    <tbody id="data"></tbody>
</table>

<script>

    //变局变量
    var index = 1;
    var size = 5;
    var count = 0;

    $(function () {
        ShowproductList();
        fenye();
    });
    function ShowproductList() {
        $.ajax({
            url: 'https://localhost:7061/api/Product/GetProductFenYe?index=' + index + '&size=' + size,
            type: 'get',
            async: false,
            success: function (res) {
                console.log(res);

                var tr = '';
                $(res.data).each(function (i, obj) {

                    tr += `    <tr>
                                        <td>${obj.id}</td>
                                        <td>${obj.code}</td>
                                        <td>${obj.name}</td>
                                            <td><img src="${obj.imgUrl}"></td>
                                        <td>${obj.description}</td>
                                        <td>${obj.price}</td>
                                        <td>${obj.stock}</td>
                                        <td>${obj.status > 0 ? "上架" : "下架"}</td>
                                            <td>${moment(obj.createTime).format("yyyy-MM-DD hh:mm:ss")}</td>
                                        <td>${obj.updateTime}</td>
                                        <td>${obj.isDeleted}</td>


                                </tr>`;
                });


                $("#data").html(tr);
                count = res.count;
            }

        });
    }

    function fenye() {

        layui.use(function () {
            var laypage = layui.laypage;
            // 完整显示
            laypage.render({
                elem: 'demo-laypage-all', // 元素 id
                count: count, // 数据总数
                limits: [3, 4, 5, 6],
                layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'], // 功能布局
                jump: function (obj) {//分页之后的动作
                    console.log(obj);
                    index = obj.curr;
                    size = obj.limit;
                    ShowproductList();


                }
            });
        });
    }

</script>